<template>
	<view v-if="pageShow">
		<view class="topbgc">
			<view class="mainpadding">
				<view class="margin_top4" @click="backPage">
					<u-icon name="arrow-left" color="#fff" size="28"></u-icon>
				</view>
				<view class="flexleft" style="margin-top: 140rpx;">
					<image :src="dtUserinfo.avatar" class="headimg margin_right3" mode=""></image>
					<view class="">
						<view class="xiaobai bigtext fonweight">{{dtUserinfo.nickName}}</view>
						<view class="flexleft margin_top2" @click="copy(dtUserinfo.userId)">
							<view class="xiaobai  ershil">ID:{{dtUserinfo.userId}}</view>
							<u-icon name="file-text" color="#fff" size="14"></u-icon>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="mainpadding ffffff radius dingwei" style="top: -20rpx;padding-top: 10rpx;">
			<u-tabs :list="tabslist" lineColor="#333" :current="tabcurrent" @click="changetab" v-if="tabsFlag" :activeStyle="{
		    color: '#333',
		    fontWeight: 'bold',
		    transform: 'scale(1.05)'
		}" :inactiveStyle="{
		            color: '#999',
					fontWeight: '540',
		            transform: 'scale(1)'
		        }" itemStyle="padding-left: 10px; padding-right: 10px; height: 44px;"></u-tabs>
			<view class="margin_top ffffff xiahuaxian" v-for="item in list" :key="item.id" @click="jumpdetail('/pages/index/dynamicDetails?id=',item.id)">
				<view class="flexbetween">
					<view class="flexleft">
						<image class="margin_right1 xiaotux" :src="item.avatar" mode=""></image>
						<view class="">
							<view class="ershiba xiaohei">{{item.nickName}}</view>
							<view class="smalltext xiaohui margin_top1">{{item.createTime}}</view>
						</view>
					</view>
					<view class="xiaohui ershil">{{$t('personHome.y')}}<span class=" fonweight" :class="item.replyNum?'xiaolan':'xiaohui'">{{item.replyNum}}</span>{{$t('personHome.rly')}}</view>
				</view>
				<view class="margin_top sanshier xiaohei">{{item.content}}</view>
				<view class="flexleft flex_wrap" v-if="item.image">
					<view class="sanshis flexcenter margin_top" v-for="(ite,index) in item.imageArray" :key="index">
						<image class="dtbabb" :src="ite" mode=""></image>
					</view>
				</view>
				<view class="flexbetween margin_top" v-if="myuserid==uid">
					<view class="sanshis flexcenter" @click.stop="currentid=item.id;modal.modalShow=true;">
						<view class="flexleft">
							<u-icon name="trash" size="16" color="#999"></u-icon>
							<view class="smalltext xiaohui">{{$t('personHome.sc')}}</view>
						</view>
					</view>
					<view class="sanshis flexcenter">
						<view class="flexleft" @click.stop="changeshow(item)">
							<u-icon name="eye" size="16" v-show="item.showStatus==1" color="#999"></u-icon>
							<u-icon name="eye-off" size="16" v-show="item.showStatus==2" color="#999"></u-icon>
							<view class="smalltext xiaohui"v-show="item.showStatus==1">{{$t('personHome.yc')}}</view>
							<view class="smalltext xiaohui" v-show="item.showStatus==2">{{$t('personHome.yyc')}}</view>
						</view>
					</view>
					<view class="sanshis flexcenter" @click.stop="edititem(item)">
						<view class="flexleft">
							<u-icon name="edit-pen" size="16" color="#999"></u-icon>
							<view class="smalltext xiaohui">{{$t('personHome.bj')}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<template v-if="myuserid==uid">
			<liu-drag-button @clickBtn="jumpdetail('/pages/index/dynamicAdd?id=',tabsid)">
				<u-icon name="plus" color="#fff" size="20"></u-icon>
			</liu-drag-button>
		</template>
		
		<moDal :message="modal" @modalSure="modalSure" @modalcancel="modalcancel"></moDal>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				tabsid: "",
				tabslist: [],
				page: 1,
				limit: 12,
				list: [],
				ischudi:false,//是否触底
				modal:{
					modalShow:false,
					title:this.$t('personHome.qrsc'),
				},
				currentid:"",
				uid:"",
				pageShow:false,
				myuserid:"",
				isLoad:false,
				tabsFlag:false,
				tabcurrent:0
			}
		},
		onLoad(options) {
			this.myuserid = uni.getStorageSync("user_id")
			if(options.uid){
				this.uid = options.uid
			}else{
				this.uid = uni.getStorageSync("user_id")
			}
			if(options.tabsid){
				this.tabsid = options.tabsid
				this.init()
			}
			this.getclass()
			this.getuserInfo()
		},
		onShow() {
			this.ischudi = false
			if(this.isLoad){
				this.init()
			}
		},
		methods: {
			modalSure(){
				if(this.modal.title==this.$t('personHome.qrsc')){
					this.dongtaiDel()
				}
				this.modalcancel()
			},
			modalcancel(){
				this.modal.modalShow = false
			},
			dongtaiDel(){//删除动态
				httpRequest.request('/api/v1/note/delete', 'GET', {
					noteId:this.currentid
				}).then(res => {
					httpRequest.toast(res.msg)
					if(res.code==200){
						this.init()
					}
				})
			},
			changeshow(item){
				httpRequest.request('/api/v1/note/update', 'POST', {
					id:item.id,
					showStatus:item.showStatus==1?2:1
				}).then(res => {
					httpRequest.toast(res.msg)
					if(res.code==200){
						item.showStatus = item.showStatus==1?2:1
					}
				})
			},
			edititem(item){//编辑动态
				uni.navigateTo({
					url:"/pages/index/dynamicAdd?id="+this.tabsid+"&noteId="+item.id
				})
			},
			getuserInfo(){
				httpRequest.request('/api/v1/users/userInfo', 'GET', {
					userId:this.uid,
				}).then(res => {
					this.dtUserinfo = res.data
					this.pageShow = true
				})
			},
			getclass(){
				httpRequest.request('/api/v1/communityCategory/list', 'GET', {}).then(res => {
					this.tabslist = res.data
					if(this.tabsid!=""){
						res.data.forEach((item,index)=>{
							if(item.id==this.tabsid){
								this.tabcurrent = index
							}
						})
						this.tabsFlag = false
						this.tabsFlag = true
						return false
					}
					this.tabsid = res.data[0].id
					this.tabsFlag = false
					this.tabsFlag = true
					this.init()
				})
			},
			changetab(e) {
				this.tabsid = e.id
				this.ischudi = false
				this.list = []
				this.init()
			},
			init(isPage, page) {
				let _this = this;
				let data = {
					pageNum: page || 1,
					pageSize: _this.limit,
					categoryId: this.tabsid,
				}
				let url = '/api/v1/note/my/list'
				if(this.myuserid != this.uid){
					this.$set(data,"uid",this.uid)
				}
				httpRequest.request(url, 'GET', data, false, false, true).then(res => {
					this.isLoad = true
					if (res.code == 200) {
						if(res.data.length==0){
							this.ischudi = true
							return false
						}else{
							this.ischudi = false
						}
						let resList = res.data;
						let dataList = _this.list;
						if (isPage == true) {
							_this.list = dataList.concat(resList);
						} else {
							this.list = []
							this.list = res.data
						}
					}
				})
			},
			onReachBottom() {
				let _this = this;
				let page = _this.page;
				if (_this.ischudi) {
					return false;
				}
				page++;
				_this.page = page;
				_this.init(true, page);
			},
		}
	}
</script>

<style lang="scss" scoped>
	.topbgc {
		background-image: url("@/static/image/system/dtbj.png");
		background-size: 100% 100%;
		height: 450rpx;
		width: 100%;
	}

	.headimg {
		width: 150rpx;
		height: 150rpx;
		box-sizing: border-box;
		border-radius: 50%;
	}

	.xiaotux {
		width: 84rpx;
		height: 84rpx;
		border-radius: 50%;
	}

	.dtbabb {
		width: 224rpx;
		height: 224rpx;
		border-radius: 10rpx;
	}
</style>